<template>
  <a-drawer width="35%" :label-col="4" :wrapper-col="14" :visible="open" @close="onClose">
    <a-divider orientation="left">
      <b>新增租户管理</b>
    </a-divider>
    <a-form-model ref="form" :model="form" :rules="rules">
      <a-form-model-item
        label="租户号"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="tenantId"
      >
        <a-input placeholder="请填写租户号" v-model="form.tenantId" />
      </a-form-model-item>
      <a-form-model-item
        label="租户名"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="tenantName"
      >
        <a-input placeholder="请填写租户名" v-model="form.tenantName" />
      </a-form-model-item>
      <a-form-model-item
        label="状态"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="status"
      >
        <a-select placeholder="请选择状态" style="width: 100%" allow-clear v-model="form.status">
          <a-select-option v-for="(d, index) in statusOptions" :key="index" :value="d.dictValue">{{ d.dictLabel }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item
        label="排序"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="sortNum"
      >
        <a-input placeholder="请填写排序" v-model="form.sortNum" />
      </a-form-model-item>
      <a-form-model-item
        label="有效期（起）"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="startTime"
      >
        <a-date-picker
          placeholder="请选择有效期（起）"
          v-model="form.startTime"
          valueFormat="YYYY-MM-DD HH:mm:ss"
          allow-clear></a-date-picker>
      </a-form-model-item>
      <a-form-model-item
        label="有效期（止）"
        has-feedback
        :labelCol="{span: 5}"
        :wrapperCol="{span: 15}"
        prop="endTime"
      >
        <a-date-picker
          placeholder="请选择有效期（止）"
          v-model="form.endTime"
          valueFormat="YYYY-MM-DD HH:mm:ss"
          allow-clear></a-date-picker>
      </a-form-model-item>
    </a-form-model>
    <div class="bottom-control">
      <a-space>
        <a-button type="primary" @click="submitForm">
          保存
        </a-button>
        <a-button type="dashed" @click="cancel">
          取消
        </a-button>
      </a-space>
    </div>
  </a-drawer>
</template>
<script>
import { getTenant, saveTenant, updateTenant } from '@/api/system/tenant'

export default {
  components: {},
  props: {},
  data () {
    return {
      open: false,
      // 状态
      statusOptions: [],
      form: {
        tenantId: undefined,
        tenantName: undefined,
        status: undefined,
        sortNum: undefined,
        startTime: undefined,
        endTime: undefined
      },
      rules: {
        tenantId: [{ required: true, message: '租户号不能为空', trigger: 'blur' }],
        tenantName: [{ required: true, message: '租户名不能为空', trigger: 'blur' }],
        sortNum: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
        status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
      }
    }
  },
  watch: {},
  computed: {},
  methods: {
    rest () {
      this.form = {
        tenantId: undefined,
        tenantName: undefined,
        status: undefined,
        sortNum: undefined,
        startTime: undefined,
        endTime: undefined
      }
    },
    // 取消按钮
    cancel () {
      this.open = false
      this.reset()
    },
    showForm (id) {
      this.open = true
      if (id) {
        getTenant(id).then(res => {
          if (res.code === 200) {
            this.form = res.data
          }
        })
      }
    },
    onClose () {
      this.open = false
    },
    submitForm () {
      this.$refs.form.validate(valid => {
        if (valid) {
          if (this.form.id) {
            updateTenant(this.form).then(res => {
              if (res.code === 200) {
                this.$message.success(
                  '修改成功',
                  3
                )
                this.open = false
                this.$emit('ok')
              }
            })
          } else {
            saveTenant(this.form).then(res => {
              if (res.code === 200) {
                this.$message.success(
                  '添加成功',
                  3
                )
                this.open = false
                this.$emit('ok')
              }
            })
          }
        }
      })
    }
  },
  created () {
    this.rest()
    this.getDicts('status').then(response => {
      this.statusOptions = response.data
    })
  },
  mounted () {
  }
}
</script>,
